<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
        <meta name="format-detection" content="telephone=no">
        <title>景点画册</title>
        <link rel="stylesheet" href="css/frozen.css">
        <link rel="stylesheet" href="css/style.css">
        <script src="js/zepto.min.js"></script>
        <script src="js/frozen.js"></script>
        <script src="js/jquery-1.9.1.min.js"></script>
        <script src="js/lib/juicer-min.js"></script>
        <script src="js/global.js"></script>
        <script src="js/jquery.jsonp.js"></script>
        <script type="text/javascript" src="cordova.js"></script>
        <script src="plugins/callActivity.js"></script>
        <script src="js/biz/huace/huace_jingdianhuace_detail.js"></script>
        <script src="js/jquery.fancybox.js "></script>
        <style>
            .dianzan {
                line-height: normal;
            }
            .w_tab_title li {
                width: 23.8%;
            }
        </style>
    </head>
    <body ontouchstart="">
    <header class="ui-header ui-header-positive ui-border-b">
        <i class="ui-icon-return" onclick="history.back()"></i>
        <h1>景点画册</h1>
        <i class="ui-icons-more" id="m_add"></i>
    </header>
    <!-- 下拉 -->
    <div class="w_cebiaoti">
        <div class="w_bga">
            <ul>
                <li class="w_shac" onclick=""><a><img src="img/shoucang.png"><i class="sc">收藏</i></a></li>
                <li class="w_fxx"><a><img src="img/fenxiang.png"><i>分享</i></a></li>
                <li class="w_jb"><a href="jubao.html" id="jb"><img src="img/jubao.png"><i>举报</i></a></li>
                <li class="w_none"><b><img src="img/m_top.png"></b></li>
            </ul>
        </div>
    </div>
    <div class="w_cs">
        <div id="divbox" class="w_ysha"><li class="w_shacx"><a><img src="img/shoucang.png"><i>已收藏</i></a></li></div>
    </div>
    <div class="w_fxaa">
        <div class="w_fengx"></div>
        <div class="w_fxbox">
            <a href="#"><img src="img/qq.png"></a>
            <a href="#"><img src="img/weixin.png"></a>
            <a href="#"><img src="img/weibo.png"></a>
            <a href="#"><img src="img/pengyou.png"></a>
        </div>
    </div>
    <script type="text/javascript">
        //下拉
        $("#m_add").click(function(){
            $(".w_cebiaoti").slideToggle();
        });
        //消失
        function codefans(){
            var box=document.getElementById("divbox");
            box.style.display="none";
        }
        setTimeout("codefans()",3000);//3秒
        Zepto(".w_cs").tap(function(){
            Zepto(".w_ysha").hide();
        });
        //收藏显示
//        Zepto(".w_shac").tap(function(){
//            Zepto(".w_ysha").show();
//        });
//        Zepto(".w_shac").tap(function(){
//            Zepto(".w_shac").hide();
//        });
        //分享
        Zepto(".w_fxx").tap(function(){
            //Zepto(".w_fxaa").show();
            shareUmeng("走青海","http://qzonestyle.gtimg.cn/qzone_v6/proj_connect_open/img/logo/logo_yinyuetai.png");
        });
        //Zepto(".w_fengx").tap(function(){
            //Zepto(".w_fxaa").hide();
        //});
    </script>

    <section class="ui-container mb50">
        <div class="ui-user-follow ui-border-b clearfix">
            <div class="ui-user-follow-info clearfix">
                <script type="text/juicer" id="top_tpl">
                <div class="ui-user-avatar">
                <a href="tade.html?id=${user.id}">
                    <img src="${user.photo}" width="55" height="55" alt="">
                </a>
                </div>
                <div class="ui-user-intro">
                    <p>${user.nickName}
                        {@if user.sex===2 }
                        <span class="sex sex-female no-left">
                            <i class="icons-sex-female"></i>${user.age}</span>
                        {@else}
                        <span class="sex sex-male no-left">
                            <i class="icons-sex-male"></i>${user.age}</span>
                        {@/if}
                            </p>
                    <p>魅力值 :
                    {@if user.charisma===null||user.charisma==='' }
                        <span class="ui-txt-red">0</span>
                    {@else}
                        <span class="ui-txt-red">${user.charisma}</span>
                    {@/if}</p>
                </div>
                </script>
            </div>
            <div class="ui-user-follow-button text-align-right">
                <a href="javascript:void(0); "class="edit"><span id="concern"></span>+关注</a>

            </div>
        </div>
        <div class="ma_tab">
            <ul class="w_tab_title clearfix">
                <li class="ma_active">景点画册</li>
                <li class="ma_look" onclick=""><span id="lookNumber"></span>人看过</li>
                <li class="ma_comment" onclick="">评论<span id="commentSize"></span></li>
                <li class="ui-tab-zan ui-border-b w_zys" id="zan-list"onclick="">
                    <div class="dianzan">
                    <i class="icons-zana"><img src="img/icons_zan.png" class="wujiang_pic_size"onclick="" id="top_pic"></i><span id="greatNumber"></span>赞</div>
                    <!--&lt;!&ndash;赞&ndash;&gt;-->
                    <!--<script>-->
                        <!--(function ($){-->
                            <!--$('.wujiang_pic_size').click(function(event) {-->
                                <!--/* Act on the event */-->
                                <!--if(this.getAttribute("src",2)=="img/icons_zan.png"){-->
                                    <!--this.src="img/icons_zanh.png";-->
                                <!--}else{-->
                                    <!--this.src="img/icons_zan.png";-->
                                <!--}-->
                            <!--});-->
                        <!--}(window.jQuery));-->
                    <!--</script>-->
                </li>
            </ul>
            <div class="ma_con01">
                <div class="wrapper">
                    <ul class="photo-list clearfix"></ul>
                </div>
            </div>
            <div class="ma_con02">
                <ul class="order-list"></ul>
            </div>
            <div class="ma_con03">
                <ul class="comment-list"></ul>
            </div>
            <div class="ma_con04">
                <ul class="order-list" id="bit_list"></ul>
            </div>
        </div>
    </section>
    <div class="album-bottom-menu">
        <ul class=" clearfix" id="plzl">
            <li class="ui-border-r"><a href="" id="comment"><i class="album-bottom-menu-comment"></i>评论</a></li>
            <li class="ui-border-r" onclick="jumptoChating()" id="chat"><i class="album-bottom-menu-chat"></i>聊天</li>
            <li class="ui-border-r">
                <i class="w-menu-zan"><img src="img/album_bottom_menu_zan.png" class="wujiang_pic_sizea"onclick="" id="bottom_pic"></i>赞
            </li>
        </ul>
    </div>
    <script>
        // tab
        $(function () {
            $('.w_tab_title li').click(function(){
                //获得当前被点击的元素索引值
                var Index = $(this).index();
                //给菜单添加选择样式
                $(this).addClass('ma_active').siblings().removeClass('ma_active');
                //显示对应的div
                $('.ma_tab').children('div').eq(Index).show().siblings('div').hide();

            });
        });
    </script>
    <script type="text/juicer" id="photo_tpl">
        {@each photos as item, index}
        <li>
            <a class="fancy" href="${item}" data-fancybox-group="gallery">
                <img src="${item}"/>
            </a>
        </li>
        {@/each}
    </script>
    <script type="text/juicer" id="order_tpl">
        {@each arrays as item, index}
        <li>
            <div class="order-list-avatar">
                <img src="${item.photo}" alt="">
            </div>
            <div class="order-list-intro">
                <div class="order-list-intro-text">
                    <p class="color666 fz16">${item.nickName}</p>
                    <p class="color666 fz14">
                        {@if item.sex===2 }
                        <span class="sex sex-female no-left">
                            <i class="icons-sex-female"></i> ${item.age}</span>
                        {@else}
                        <span class="sex sex-male no-left">
                            <i class="icons-sex-male"></i>${item.age}</span>
                        {@/if}
                    </p>
                </div>
            </div>
        </li>
        {@/each}
    </script>
    <script type="text/juicer" id="comment_tpl">
        {@each arrays as item, index}
        <li class="ui-border-b">
            <div class="comment-list-avatar">
                <img src="${item.photo}" width="40" height="40" alt="">
            </div>
            <div class="comment-list-content">
                <div class="comment-list-content-text">
                    <div class="clearfix">
                        <div class="comment-list-content-user">
                           ${item.nickName}
                        {@if item.sex===2 }
                        <span class="sex sex-female no-left">
                            <i class="icons-sex-female"></i>
                            ${item.age}
                        </span>
                        {@else}
                        <span class="sex sex-male no-left">
                            <i class="icons-sex-male"></i>
                            ${item.age}
                        </span>
                        {@/if}
                        </div>
                        <div class="comment-list-content-time">
                            <p>${item.createTime}</p>
                        </div>
                    </div>
                    <p class="color666 fz12">${item.comment}</p>
                </div>
            </div>
        </li>
        {@/each}
    </script>
    <script type="text/juicer" id="bit_tpl">
        {@each arrays as item, index}
         <li>
            <div class="order-list-avatar">
                <img src="${item.photo}" alt="">
            </div>
            <div class="order-list-intro">
                <div class="order-list-intro-text">
                    <p class="color666 fz16">${item.nickName}</p>
                    <p class="color666 fz14">
                    {@if item.sex===2 }
                        <span class="sex sex-female no-left">
                            <i class="icons-sex-female"></i>
                            ${item.age}
                        </span>
                        {@else}
                        <span class="sex sex-male no-left">
                            <i class="icons-sex-male"></i>
                            ${item.age}
                        </span>
                        {@/if}
                    </p>
                </div>
            </div>
        </li>
        {@/each}
    </script>
    </body>
</html>
<!--缩略图样式-->
<script type="text/javascript">
    $(document).ready(function() {
        $('.fancy').fancybox();
        $('.fancybox-thumbs').fancybox({
            prevEffect : 'block',
            nextEffect : 'block',
            closeBtn  : false,
            arrows    : false,
            nextClick : true,
            helpers : {
                thumbs : {
                    width  : 50,
                    height : 50
                }
            }
        });
    });
</script>